<template>
  <button class="bottom" type="primary" @click="loginHandle">授权登录</button>
</template>

<script setup>
import { apiLogin, apiGetUser } from '../../apis/login'
import { storeToRefs } from 'pinia'
import useStore from '@/stores/userStore.js'
const { token } = storeToRefs(useStore())
const { getUserInfo } = useStore()
import { isTel } from 'utils/validate.js'
const loginMode = ref(1) // 1验证码登录 2账号密码
const formData = ref({})
const checked = ref([])
const timer = ref(null)
const countDownNum = ref(60)
const formRef = ref(null)

const loginHandle = () => {
  uni.login({
    provider: 'weixin', //使用微信登录
    success: (loginRes) => {
      apiLogin({
        jsCode: loginRes.code,
        appId: 'wxb823e63230d83816',
      })
    },
    fail(err) {
      console.log(err)
    },
  })
}

// 页面卸载清除计时器
const login = async () => {
  await formRef.value.validate()
  if (checked.value.length === 0) {
    uni.showToast({
      title: '请先仔细阅读隐私协议和用户协议，并勾选同意',
      icon: 'none',
      mask: true,
    })
    return
  }
  uni
    .request({
      url: '/login',
      method: 'POST',
      noToken: true,
      data: {
        username: 'admin',
        password: 'admin123',
      },
    })
    .then((res) => {
      token.value = res.token
      getUserInfo()
      uni.navigateBack()
    })
}
</script>

<style lang="scss" scoped>
.login_page {
  padding: 0 40rpx;
  box-sizing: border-box;
  height: 100%;
  width: 100%;
  background-image: url('https://code-life-1302946402.cos.ap-chongqing.myqcloud.com/project/zyg/login_bgk.jpeg');
  background-repeat: no-repeat;
  background-size: cover;

  &_title {
    margin-top: 30%;
    padding: 40rpx;
    font-size: 56rpx;
    color: #fff;
    text-align: center;
    font-family: 'Courier New', Courier, monospace;
  }

  &_form {
    padding: 60rpx 20rpx;
    border-radius: 20rpx;
    background-color: #fff;
    &_title {
      padding: 20rpx 0;
      display: flex;
      justify-content: space-between;
      align-content: center;
      .left {
        font-size: 36rpx;
        font-weight: bold;
      }
      .right {
        font-size: 26rpx;
        color: $uni-color-primary;
      }
    }
    .count_down_num {
      font-size: 24rpx;
      color: gray;
    }
    .agree {
      position: relative;
      left: -20rpx;
      font-size: 24rpx;
    }
    .submit_btm {
      margin: 0rpx 40rpx;
      padding: 20rpx;
      color: #fff;
      text-align: center;
      border-radius: 40rpx;
      background-color: $uni-color-primary;
    }
  }
}
</style>
